<template>
  <div class="actual">
    <div class="oimg">
      <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
      <van-swipe-item> <img src="/oimg/1.png" alt=""> </van-swipe-item>
      <van-swipe-item> <img src="/oimg/2.png" alt=""> </van-swipe-item>
      <van-swipe-item><img src="/oimg/3.png" alt=""></van-swipe-item>
      <van-swipe-item><img src="/oimg/4.png" alt=""></van-swipe-item>
      <van-swipe-item><img src="/oimg/5.png" alt=""></van-swipe-item>
      </van-swipe>
    </div>
    <div class="box">
        <router-link to="/home/actual/default" >默认</router-link>
        <router-link to="/home/actual/newest" >最新</router-link>
        <router-link to="/home/actual/volume" >销量</router-link>
        <router-link to="/home/actual/update" >更新</router-link>
        <router-link to="/classification" class="all">全部</router-link>
    </div>
    <router-view/>
  </div>
</template>

<script>

export default {

}
</script>

<style scoped>
.van-swipe-item{
  margin-top: .1rem;
  height: 1.16rem;
  /* margin-right: .1rem; */
}
  img{
    width: 3.45rem;
    height: 1.15rem;
    border-radius: .1rem;
  }
  .box{
    width: 3.45rem;
    /* background-color: tomato;   */
    margin: auto;
    display: flex;
    margin-top: .2rem;
  }
  a{
    margin-right: .22rem;
    font-size: .12rem;
    color: black;
  }
  .router-link-active{
    color: #7f7f7f;
  }
  .oimg{
    width: 3.45rem;
    height:1.16rem;
    /* background-color:aqua; */
    margin: auto;
  }
  .all{
    margin-left: 1.15rem;
  }
   .my-swipe .van-swipe-item {
    color: #fff;
    font-size: .2rem;
    line-height: 1.16rem;
    text-align: center;
  }
</style>